const elevator = document.querySelector('.xtx-elevator');
const backTop = document.querySelector('#backTop');
// const newGoods = document.querySelector('a[data-name=new]');
const newGoods = document.querySelector('.xtx_goods_new');
const popular = document.querySelector('.xtx_goods_popular');
const brand = document.querySelector('.xtx_goods_brand');
const topic = document.querySelector('.xtx_goods_topic');

console.log(newGoods);
window.addEventListener('scroll', function() {
    const n = document.documentElement.scrollTop + 1
    elevator.style.opacity = n >= 300 ? 1 : 0
    elevator.querySelector('a.active') && elevator.querySelector('a.active').classList.remove('active')
        // console.log(elevator.querySelector('a'));
        // console.log(n);
        // console.log(elevator.querySelector('a[data-name=new]'));
    if (n >= newGoods.offsetTop && n < popular.offsetTop) {
        elevator.querySelector('a[data-name=new]').classList.add('active')
    } else if (n >= popular.offsetTop && n < brand.offsetTop) {
        elevator.querySelector('a[data-name=popular]').classList.add('active')
    } else if (n >= brand.offsetTop && n < topic.offsetTop) {
        elevator.querySelector('a[data-name=brand]').classList.add('active')
    } else if (n >= topic.offsetTop) {
        elevator.querySelector('a[data-name=topic]').classList.add('active')
    }
})
backTop.addEventListener('click', function(e) {
    if (e.target.tagName === 'A') {
        window.scrollTo(0, 0)
    }
})
elevator.addEventListener('click', function(e) {
    if (e.target.tagName === 'A') {
        console.log(e.target.dataset.name);
        switch (e.target.dataset.name) {
            case 'new':
                window.scrollTo(0, newGoods.offsetTop)
                break;
            case 'popular':
                window.scrollTo(0, popular.offsetTop)
                break;
            case 'brand':
                window.scrollTo(0, brand.offsetTop)
                break;
            case 'topic':
                window.scrollTo(0, topic.offsetTop)
                break;
            default:
                break;
        }
    }
})